<%-- 
    Document   : showOneAnimal
    Created on : Nov 20, 2013, 12:12:49 AM
    Author     : Лерок
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Animals</title>
    </head>
    <body>
        <!--        <h3>show one</h3>
                <pre>${animalsArr}</pre>
                <pre>${typesArr}</pre>-->


        <style>
            .animals-list form > * {
                display: inline-block;
            }
            .type-list form > * {
                display: inline-block;
            }
            .searchTarget {
                color: green;
            }
        </style>
        <ul class="animals-list">
            <li>Name Animal</li>

            <c:forEach items="${animalsArr}" var="animal">
                <li>
                    <form action="/myproject1/add" method="post">
                        <input name="id" type="hidden" value="${animal.id}">
                        <input name="name" type="text" value="${animal.name}">
                        <input name="weigth" type="text" value="${animal.weigth}">
                        <select name="typeId">
                            <c:forEach items="${typesArr}" var="type">
                                <option <c:if test="${animal.typeId == type.id}"> selected </c:if> value="${type.id}">${type.name}</option>  

                            </c:forEach>
                        </select>
                        <input type="submit">
                        <button formaction="/myproject1/delete">Delete</button>
                    </form>
                </li>
            </c:forEach>
        </ul>
        
        <ul class="type-list">
            <li>Name Type</li>

            <c:forEach items="${typesArr}" var="type">
                <li>
                    <form action="/myproject1/addType" method="post">
                        <input name="id" type="hidden" value="${type.id}">
                        <input name="name" type="text" value="${type.name}">
                        <select multiple size="1" name="animalsId">
                            <% int count = 0; %>
                            <c:forEach items="${animalsArr}" var="animal">
                                <option <c:if test="${type.id == animal.typeId}"> selected </c:if> value="${animal.id}">${animal.name}</option>  
                                <c:if test="${type.id == animal.typeId}"> <% count++; %> </c:if>
                                 
                            </c:forEach>
                        </select>
                        <span><%= count %></span>
                        <input type="submit">
                        <button formaction="/myproject1/deleteType">Delete</button>
                    </form>
                </li>
            </c:forEach>
        </ul>


        <h4>Create animal</h4>
        <form action="/myproject1/add" method="post">
            <input name="name" value="enter animal name">
            <input name="weigth" value="enter animal weigth">
            <h4>Choose the type of animal</h4>
            <select name="typeId">
                <c:forEach items="${typesArr}" var="type">
                    <option <c:if test="${animal.typeId == type.id}"> selected </c:if> value="${type.id}">${type.name}</option>  

                </c:forEach>
            </select>
            <input type="submit">
        </form>

        <h4>Create type</h4>
        <form action="/myproject1/addType" method="post">
            <input name="name" type="text" value="Enter type name">
            <h4>Choose animals</h4>
            <select multiple size="1" name="animalsId">
                <c:forEach items="${animalsArr}" var="animal">
                    <option value="${animal.id}">${animal.name}</option>  
                </c:forEach>
            </select>
            <input type="submit">
        </form>

        <form action="/myproject1/find" method="get">
            <input name="name" type="text" value="name of type for search">
            <input type="submit">
        </form>
    </body>
</html>
